<template>
  <div>
    <el-card>
      <el-row :gutter="20">
        <el-col :span="24">
          <el-card shadow="never" style="box-shadow: none !important;">
            <div slot="header" class="clearfix">
              <span>基本设置</span>
            </div>

            <!-- 表单配置 -->
            <el-form ref="baseform" :rules="formRules" :model="form" label-width="120px">
              <el-form-item label="数据网网段" prop="dbnet">
                <el-input v-model="form.dbnet" class="elInputS"></el-input>
              </el-form-item>
              <el-form-item label="用户名称" prop="userN">
                <el-input v-model="form.userN" class="elInputS"></el-input>
              </el-form-item>
              <el-form-item label="系统VDR类型">
                <el-select v-model="form.sysVdrType" class="elInputS" placeholder="请选择系统VDR类型">
                  <el-option :label="item" v-for="(item, index) in sysVdrTypeCfg" :value="item" :key="index"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="默认迁移代理">
                <el-select
                    class="elInputS"
                    v-model="form.agentIp"
                    filterable
                    allow-create
                    default-first-option
                    placeholder="请输入迁移代理IP地址">
                    <el-option
                      v-for="(item, index) in tempAgentIp"
                      :key="index"
                      :label="item"
                      :value="item">
                    </el-option>
                  </el-select>
              </el-form-item>
              <el-form-item label="主备心跳监测">
                <el-col :span="3" style="padding-left: 0;min-width: 210px;">
                  <el-input class="elInputS" v-model="form.listenActive"></el-input>
                </el-col>
                <el-col :span="2">
                  毫秒
                </el-col>
              </el-form-item>
              <el-form-item label="VDR存储报警">
                <el-col :span="3" style="padding-left: 0;min-width: 210px;">
                  <el-input type="number" class="elInputS" min="0" max="100" v-model="form.vdrWarning"></el-input>
                </el-col>
                <el-col :span="10">%(0：不报警)</el-col>
              </el-form-item>
              <el-form-item label="VDR结构">
                <el-col :span="7">
                  <el-checkbox v-model="form.isSan" true-label="1" false-label="0">VDR为SAN结构</el-checkbox>
                </el-col>
                <el-col :span="7">

                </el-col>
              </el-form-item>
              <el-form-item label="广告组设置">
                <el-col :span="3" style="min-width: 180px;">
                  <el-checkbox v-model="form.absSeting" true-label="1" false-label="0">启用广告组长度限制</el-checkbox>
                </el-col>
                <el-col :span="3" style="min-width: 220px;">
                  误差范围: <el-input type="number" class="elInputXS" min="0" max="100" v-model="form.errScope"></el-input>秒
                </el-col>
                <el-col :span="5" style="min-width: 240px;">
                  <el-checkbox v-model="form.manualGetList" true-label="1" false-label="0">手动提取广告节目组</el-checkbox>
                  <el-popover
                    placement="right"
                    width="400"
                    trigger="click">
                    <p>备注:</p>
                    <p>1，如果启用了广告组长度限制，那么广告组的实际长度必须在指定的误差范围之内，超出该误差范围，广告节目单将无法审核通过。</p>
                    <p>2，如果启用了手动提取广告节目组，那么当广告节目单修改之后，播出软件不会自动更新广告组的节目，需要通过右键菜单手动提取。</p>
                    <span slot="reference"><i class="el-icon-question questionIco" type="warning"></i></span>
                  </el-popover>
                </el-col>
              </el-form-item>
              <el-form-item label="节目单参数">
                <el-col :span="3" style="min-width: 180px;">
                  <el-checkbox v-model="form.remoteUpPlist" true-label="1" false-label="0">远程更改播出串联单</el-checkbox>
                </el-col>
                <el-col :span="3" style="min-width: 210px;">
                  <el-checkbox v-model="form.autoSameLength" true-label="1" false-label="0">节目长度自动与素材同长</el-checkbox>
                </el-col>
                <el-col :span="5" style="min-width: 280px;">
                  <el-checkbox v-model="form.matNotDotAgree" true-label="1" false-label="0">素材无出入点,不允许审核通过</el-checkbox>
                  <el-popover
                    placement="right"
                    width="400"
                    trigger="click">
                    <p>备注:</p>
                    <p>1，如果选择了远程更改播出串联单，那么就可以在其他工作站上的节
                    目单编辑软件中修改当天的播出串联单。修改以后，软件将自动通知播出站自动调入修改后的播出串联单。</p>
                    <p>2，如果选择了节目长度自动与素材同长，那么调入播出串联单时，系统将会自动将节目长度调整为素材的实际长度，素材如果远程重新设置如出点了，
                    也会自动调整节目长度。（广告组长度调整设置在广告组设置中另行设置）</p>
                    <span slot="reference"><i class="el-icon-question questionIco" type="warning"></i></span>
                  </el-popover>
                </el-col>
              </el-form-item>
              <el-form-item label="其它设置">
                <el-col :span="3" style="min-width: 220px;">
                  <el-checkbox v-model="form.TVseriesAutoSend" true-label="1" false-label="0">电视剧名自动发送给字幕机</el-checkbox>
                </el-col>
                <el-col :span="3" style="min-width: 220px;">
                  <el-checkbox v-model="form.checkPlay" true-label="1" false-label="0">节目审查后才能播出</el-checkbox>
                </el-col>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" v-permission="permission.edit" @click="onSubmit">确认</el-button>
                <el-button @click="onCancel">取消</el-button>
              </el-form-item>
            </el-form>
          </el-card>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
import { baseinfo, baseseting } from '@/api/system/baseconfig.js'
export default {
  data() {
    return {
      // 指令权限
      permission: {
        edit: ['admin', 'baseconfig::edit']
      },
      // 系统VDR类型配置
      sysVdrTypeCfg: [
        'GVG Profile',
        'GVG Turbo',
        'GVG T2',
        'Leitch Nexio',
        'Ltech VisionServer',
        '360 ImageServer',
        'Leitch 3600',
        'Nexio(L_Protocol)',
        'XOR Media',
        'EVS XT[2]',
        'Omneon'
      ],
      tempAgentIp: [
        '192.168.0.55',
        '192.168.0.56'
      ],
      // 表单字段
      form: {
        dbnet: '',
        userN: '',
        sysVdrType: '',
        agentIp: '',
        listenActive: '0',
        vdrWarning: '0',
        isSan: '0',
        errScope: '0',
        manualGetList: '0',
        remoteUpPlist: '0',
        autoSameLength: '0',
        matNotDotAgree: '0',
        TVseriesAutoSend: '0',
        checkPlay: '0'
      },
      // 表单验证
      formRules: {
        dbnet: [
          { required: true, message: '请输入数据网网段', trigger: 'blur' }
        ],
        userN: [
          { required: true, message: '请输入用户名称', trigger: 'blur' }
        ]
      }
    }
  },
  created() {
    this.getbaseinfo()
  },
  methods: {
    getbaseinfo() {
      baseinfo().then(res => {
        this.form = res.data.data
      })
    },
    onSubmit() {
      // 表单提交
      this.$refs.baseform.validate(valid => {
        if (!valid) return
        // 表单设置
        baseseting(this.form).then(res => {
          if (res.data.meta.status === 200) {
            this.$message.success('修改成功')
            this.getbaseinfo()
          }
        })
      })
    },
    onCancel() {
      this.$router.back(-1)
    }
  }
}
</script>

<style>
  .questionIco {
    cursor: pointer;
    padding-left: 20px;
    color: #EE9900;
    font-size: 16px;
  }
  .el-popper[x-placement^=right] .popper__arrow::after {
    border-right-color: #EE9900;
  }
</style>
